<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>远程唤醒</title>
		<link rel="stylesheet" href="../static/css/bootstrap.min.css" />
		<style type="text/css">
			body{
				padding-top: 50px;
  				padding-bottom: 20px;
			}

		</style>
	</head>
	<body>

	    <nav class="navbar navbar-inverse navbar-fixed-top">
	      <div class="container">
	        <div class="navbar-header">
	          <span class="navbar-brand">远程唤醒</span>
	        </div>
	      </div>
	    </nav>

	    <div class="container" style="padding-top: 20px;">
	      <div class="row">
	      	<div class="col-md-12" id="prompt">
	      		<!--<div class="alert alert-danger">
				  <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
				  唤醒失败：
				</div>-->
	      	</div>
	      </div>
	      <div class="row">
	        <div class="col-xs-12 col-md-6 col-lg-6">
				<form id="form">
				  <div class="form-group">
				    <label for="mac_addr">MAC地址</label>
<!--				    <input type="text" class="form-control" id="mac_addr" name="mac_addr" placeholder="请输入要唤醒的MAC地址" value="B4:2E:99:86:F7:82" />-->
					  <select class="form-control" id="mac_addr" name="mac_addr">
						  <option value="B4:2E:99:86:F7:82">xie</option>
						  <option value="E4:54:E8:B8:9D:14">song</option>
						  <option value="8C:EC:4B:C9:D2:EF">lc</option>
						  <option value="E8:6A:64:92:18:39">sirui</option>
						  <option value="B4:2E:99:86:F7:47">zhou</option>
					  </select>
				  </div>
				  <button type="button" class="btn btn-default" id="submit_btn">提交</button>
				</form>
	        </div>

	      </div>

	      <hr>

	      <footer>
	        <p>&copy; 2020 Company, Inc.</p>
	      </footer>
	    </div> <!-- /container -->

		<script src="../static/js/jquery.min-2.1.4.js"></script>
		<script src="../static/js/bootstrap.min.js"></script>
		<script src="../static/js/toast.js"></script>
		<script>

			// Toast('这是一个弹框',2000);

			$('#submit_btn').on('click',function(){
				Toast('click',2000);
				$.ajax({
					type:"post",
					url:"wake",
					async:true,
					data:$('#form').serialize(),
					success:function(data){
						console.log(data);
						if(data.code == 1){
						    $('#prompt').html('<div class="alert alert-success"><span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>请求成功</div>');
				    		Toast('发送成功',2000);
                        }
                        else if(data.code == 0){
                            $('#prompt').html('<div class="alert alert-danger"><span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>请求失败：' + data.message + '</div>');
							Toast('发送失败',2000);
                        }
					},
					error:function(){
						Toast('error',2000);
					},
					contentType:'application/x-www-form-urlencoded'
				});
//
			});
		</script>

	</body>
</html>